<script type="text/javascript">
    var paginationTotal = 1;//记录总数
    $(function() {
        initData(0);
    });

    function loadData(page, pageSize) {
        var pu_id = $('[name=pu_id]').val();
        var customer_id = $('[name=customer_id]').val();
        $.ajax({
            type: "POST",
            async: false,
            dataType: "json",
            url: "/customer/customer/planusagedetail", //请求的处理url
            data:{
                'page':page,'pageSize':pageSize,
                'pu_id':pu_id,'customer_id':customer_id
            },
            success: function(json) {
                var list = "";
                paginationTotal = json.count;
                if (json.ask != 1) {
                    list = "<td colspan='5' class=''>&nbsp;<{$lang.no_data}></td>";
                } else {
                    //var i = page==1 ? 1 : pageSize * (page-1)+1;
                    $.each(json.result, function(key, val) {
                        if ((key + 1) % 2 == 1) {
                            list += "<tr class=''>";
                        } else {
                            list += "<tr class='even-tr'>";
                        }
                        list += "<td >" + val.ref_id + "</td>";
                        list += "<td >" + val.type + "</td>";
                        list += "<td >" + val.count + "</td>";
                        list += "<td >" + val.current_count + "</td>";
                        list += "<td >" + val.created + "</td>";
                        list += "</tr>";
                    });
                }
                $("#list").html(list);
            }
        });
    }
</script>
<style type="text/css">
    .div-head span {
        border: 1px solid #E6E6E6;
        height: 30px;
        padding: 3px;
        line-height: 30px;
    }

    .div-head span a {
        text-decoration: none;
        font-weight: bold;
        color: #000;
    }

    .tabs-head-active {
        background: #C9C9C9;
    }

    #iTitle div {
        display: inline-block;
        float: left;
        padding: 0 0 0 10px;
        margin-bottom: 12px;
    }

    .mySelect {
        height: 22px;
        border: 1px solid #CCCCCC;
    }

    #iTitle input {
        height: 20px;
        border: 1px solid #CCCCCC;
    }

    .current {
        border: 0px solid #C9C9C9;
    }

    table {
        border-collapse: collapse;
    }

    table.myTab th {
        background: #f1f6f9 url(/images/left-menu-li.gif) repeat-x left top
    }

    .myTab td {
        padding: 3px;
        border: 1px solid #AECED9;
        text-align: center
    }

    .myTab tr:hover {
        color: #2F82A0;
        background: #FAFAFA
    }

    .myTab th {
        padding: 5px;
        border: 1px solid #AECED9;
        text-align: center;
    }

    .even-tr {
        background: #E6F3F9
    }

    .hover-tr {
        background: #318DAC;
        color: white
    }

    .editTab td {
        padding: 1px;
    }

    .current tr {
        background: none repeat scroll 0 0 #F2F8FD;

    }

    .current tr td {
        border: 1px solid #C9C9C9;
        height: 30px;
        line-height: 30px;
    }

    .tdleft {
        width: 12%;
        font-weight: bold;
        text-align: right;
        padding-right: 5px;
    }

    .tdright {
        width: 20%;
        text-align: left;
        padding-left: 5px;
        font-family: Verdana;
    }

    .tdright span {
        color: red;
    }

    span.detail {
        float: right;
    }
</style>
<!--<{$lang.current}>套餐-->
<div id="content">
    <input type="hidden" name="customer_id" id="customer_id" value="<{$customer_id}>"/>
    <input type="hidden" name="pu_id" id="pu_id" value="<{$pu_id}>"/>
    <!--<{$lang.current}>套餐-->
    <div id="plan-0">
        <div style="height:10px;font-size:0;width:100%;clear:both;"></div>
        <table width="100%" border="0" cellspacing="0" cellpadding="0" class="myTab">
            <thead>
            <tr>
                <th><{$lang.referNo}></th>
                <th><{$lang.type}></th>
                <th><{$lang.used}></th>
                <th><{$lang.remain}><{$lang.quantity}></th>
                <th><{$lang.create}><{$lang.time}></th>
            </tr>
            </thead>
            <tbody id="list">
            </tbody>
        </table>
        <div class="pagination"></div>
    </div>
    <!--end <{$lang.current}>套餐-->
</div>